/*
 * @Date: 2024-02-28 14:46:23
 * @LastEditors: lyx
 * @LastEditTime: 2024-03-13 15:37:47
 * @FilePath: \taro-template3\src\components\CustomFooter\TextInput\index.tsx
 * @Description: 
 */
import { View } from "@tarojs/components";
import { IconFont } from "@nutui/icons-react-taro";
import ai from "@/assets/images/voiceInput.png";
import styles from "./index.module.scss";
import { ITextInputProps } from "types/TextInput";
import { Input, Toast } from "@nutui/nutui-react-taro";
import { useContext, } from "react";
import { ChatContext } from "@/pages/index/hooks/store";


function TextInput(props: ITextInputProps) {
  const { onClick } = props;
  const { value, setValue, handle } = useContext(ChatContext);

  return (
    <View className={styles["text-input-wrapper"]}>
      <Toast id="test" />
      <Input
        value={value}
        confirmType="send"
        placeholder="输入你的问题"
        // placeholder-class="none"
        // placeholder-style="color:#b3b3b3;font-size:1.2rem;"
        className={styles["text-input"]}
        cursorSpacing={100}
        alwaysEmbed={true}
        onConfirm={() => {
          handle();
        }}
        onChange={(e) => {
          setValue(e);
        }}
      />
      <IconFont
        name={ai}
        size="2rem"
        onClick={(e: any) => {
          console.log("IconFont onClick");
          onClick(e);
        }}
      />
    </View>
  );
}

export default TextInput;
